<template>
	<view class="m-page m-main-bgs">
		<view class="has-background bg-default">
			<view class="background opacity-30" style="background-image: url(../../static/setup/tomorrowland.png);">
				<image src="../../static/setup/tomorrowland.png" alt="" style="display: none;"></image>
			</view>
			
			<view class="login-container">
				<view class="row no-gutters" style="min-height: 100vh;">
					<view class="col-12 align-self-start"></view>
					<view class="wrap">
                        <u-row gutter="16">
							<u-col span="4">
								<view class=""></view>
							</u-col>
							<u-col span="4">
								<view class="">
									<view class="mt20 logolanding">
										<!-- 这里放置了 LOGO 显示 -->
									</view>
								</view>
							</u-col>
							<u-col span="4">
								<view class=""></view>
							</u-col>
						</u-row>
					</view>
					
					<view class="wrap">
					    <u-row gutter="16">
							<u-col span="3">
								<view class=""></view>
							</u-col>
							<u-col span="8">
								<view class="">
									<view class="mt21">
										<view class="col-12 text-center">
											<view class="text-uppercase font-weight-medium m-title">EP</view>
											<p>全球站数字世界的未来，我来 ！</p>
										</view>
									</view>
								</view>
							</u-col>
							<u-col span="2">
								<view class=""></view>
							</u-col>
						</u-row>
					</view>
					
					<view class="col-12 align-self-end mb-4 text-center">
						<view class="row">
							<view class="col">
							</view>
							<view class="col">
							</view>
						</view>
					</view>
				</view>
			</view>

		</view>

	</view>
</template>

<script>
	export default {
		methods: {

		},
		onLoad() {
			setTimeout(function(x) {
				uni.navigateTo({
					url: '/pages/setup/setup'
				})
			}, 3000)
		}
	}
</script>

<style scoped lang="scss">
	.has-background {
		overflow: hidden;
		display: block;
		position: relative;
	}
.wrap {
		padding: 24rpx;
	}

	.u-row {
		margin: 40rpx 0;
	}

	.demo-layout {
		height: 80rpx;
		border-radius: 8rpx;
	}

	.bg-purple {
		background: #d3dce6;
	}

	.bg-purple-light {
		background: #e5e9f2;
	}

	.bg-purple-dark {
		background: #99a9bf;
	}
	.bg-default {
		background-color: #111230 !important;
		color: #ffffff;
	}



	.background {
		height: 100%;
		width: 100%;
		position: absolute;
		margin: 0;
		padding: 0;
		top: 0;
		left: 0;
		z-index: 1;
		background-position: center top;
		background-size: cover;
		background-repeat: no-repeat;
	}

	.background+* {
		position: relative;
		z-index: 1;
	}

	.login-container {
		min-height: 100vh;
		padding: 0 15px;
		height: auto;
	}

	.logo-landing {
		width: 400px;
		height: 400rpx;
		margin-bottom: 32rpx;
		image{
			width: 100%;
			height: 100%;
			vertical-align: middle;
		}
	}
	.mt20 {
	    margin-top: 25vw;
	}
	.mt21 {
	    margin-top: 0vw;
	}
	.logolanding {
		background-image: url(../../static/setup/logo.png);
		background-position: 0% 0%;
		background-size: 100% 100%;
		/* width: 30vw; */
		height: 28vw;
		background-repeat: no-repeat;
	}
	.m-title {
		margin-bottom: 32rpx;
		font-weight: bolder;
		font-size: 8vw;
	}
</style>
